<template>
	<view class="home-search" id="home-search" :style="{backgroundColor: props.bgColor, top: props.top + 'px'}">
		<view class="home-search-box" @click.stop="proxy.utils.uni.route.go('/pages-hospital-services/patient-search/index')">
			<view class="home-search-icon gy_icon_search" color="#CBCFDF"></view>
			<view class="home-search-input">搜索医生、科室</view>
			<view class="home-search-text">搜索</view>
		</view>
		<view class="home-search-btn" @click.stop="goAiGuidance">
			<image :src="proxy.utils.image.fullPath('6584c8fe8b977024a5303a54f91a967bd1403a5c12628b74d9ae7e13978fe848.gif')"></image>
			AI智能导诊
		</view>
	</view>
</template>

<script lang="ts" setup>
	
	import {
		computed,
		onMounted,
		getCurrentInstance
	} from "vue";
	
	const emits = defineEmits(["height"]);
	
	const props = defineProps({
		bgColor: {
			type: String
		},
		top: {
			type: Number,
			default: 0
		}
	});
	
	const { proxy } : any = getCurrentInstance();
	
	const patient = computed(() => proxy.store.patient.current);
	
	function goAiGuidance(){
		proxy.utils.uni.route.go('/pages-hospital-services/ai-guidance/index')
		// if(patient.value){
		// 	proxy.utils.uni.route.go('/pages-hospital-services/ai-guidance/index')
		// 	// proxy.utils.uni.route.go('/pages-hospital-services/ai-qa/index')
		// }else{
		// 	proxy.utils.uni.route.go("/pages-system/login/index");
		// }
	}

	onMounted(() => {
		// #ifdef MP-WEIXIN
		proxy.createSelectorQuery().select("#home-search").boundingClientRect((res: any)=>{
			emits("height", res.height);
		}).exec();
		// #endif
	});
	
</script>

<style lang="scss" scoped>
	.home-search {
		position: sticky;
		left: 0;
		width: 100%;
		z-index: 100;
		@include flex-between-center;
		padding: var(--gy-gap);
		.home-search-box {
			flex: 1;
			height: 80rpx;
			border-radius: var(--gy-border-radius-large);
			padding: 0 var(--gy-gap);
			border: 2rpx solid #CBCFDF;
			margin-right: var(--gy-gap);
			background-color: var(--gy-card-bg-color);
			@include flex-between-center;
			.home-search-icon {
				font-size: var(--gy-font-size-medium);
				color: var(--gy-color-primary);
			}
			.home-search-input {
				padding-left: 15rpx;
				font-size: var(--gy-font-size-base);
				line-height: var(--gy-font-size-base);
				font-weight: 400;
				flex: 1
			}
			.home-search-text {
				font-size: var(--gy-font-size-base);
				font-weight: bold;
			}
		}
		.home-search-btn {
			position: relative;
			width: 200rpx;
			height: 80rpx;
			@include flex-center-center;
			border-radius: var(--gy-border-radius-large);
			border: 2rpx solid #CBCFDF;
			font-weight: 600;
			background-color: var(--gy-card-bg-color);
			font-size: var(--gy-font-size-medium);
			image {
				position: absolute;
				top: -35rpx;
				left: 0;
				display: block;
				width: 90rpx;
				height: 70rpx;
			}
		}
	}
</style>